<!DOCTYPE html>
<html>

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<script type="text/javascript">
    var oNew = document.getElementById("news");
    document.getElementById("btnAdd").onclick = function () {
        oElentment = document.createElement("li");
        oTextNode = document.createTextNode("动态添加列表条目示例");
        oElentment.appendChild(oTextNode);
        oNew.appendChild(oElentment);
    }
    document.getElementById("btnDel").onclick = function () {
        if (oNew.hasChildNodes()) {
            oNew.removeChild(oNew.lastChild);
        }
    }
</script>

<body>
    <ul id="news">
        <li>添加列表条目</li>
        <li>添加列表条目</li>
    </ul>
    <input type="button" id="btnAdd" value="+" />
    <input type="button" id="btnDel" value="-" />

</body>

</html>